<!--来料检验单子窗口-->
<template>
    <div>
        <el-tabs v-model="activeName">
        <el-tab-pane label="基础信息" name="Datas">
            <el-form :model="model" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm page-form">
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="检验单编号" prop="RecordCode">
                            <el-input v-model="model.RecordCode" placeholder="请输入检验单编号" :readonly="true"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="检验方式" prop="InspectWay">
                            
                            <el-input v-model="model.InspectWay" placeholder="请选择检验方式" :readonly="true"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="版本" prop="Version">
                            <el-input v-model="model.Version" placeholder="请输入版本" :readonly="true"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                    
                    <el-divider>物料与供应商</el-divider>

                    <el-row>
                        <el-col :span="8">
                            <el-form-item label="到货通知单Id" prop="WareHouseInboundBillId">
                                <el-input v-model="model.WareHouseInboundBillId" placeholder="请选择到货通知单" :readonly="true"></el-input>
                            </el-form-item>
                        </el-col>

                        <el-col :span="8">
                            <el-form-item label="产品物料编码" prop="ItemCode">
                                <el-input v-model="model.ItemCode" placeholder="请选择产品物料" :readonly="true"></el-input>
                            </el-form-item>
                        </el-col>

                        <el-col :span="8">
                            <el-form-item label="产品物料名称" prop="ItemName">
                                <el-input v-model="model.ItemName" placeholder="产品物料名称" :readonly="true"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="8">
                            <el-form-item label="供应商编号" prop="VendorId">
                                <el-input v-model="model.VendorId" placeholder="供应商编号" :readonly="true"></el-input>
                            </el-form-item>
                        </el-col>

                        <el-col :span="8">
                            <el-form-item label="供应商名称" prop="VendorName">
                                <el-input v-model="model.VendorName" placeholder="供应商名称" :readonly="true"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8">
                            <el-form-item label="备注" prop="Remark">
                                <el-input v-model="model.Remark" placeholder="备注" :readonly="true"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    
                    <el-divider>检测情况</el-divider>

                    <el-row>
                        <el-col :span="8">
                             <el-form-item label="本次接收数量" prop="Count">
                                <el-input v-model="model.Count" placeholder="本次接收数量" :readonly="true"></el-input>
                            </el-form-item>
                        </el-col>
                        
                        <el-col :span="8">
                             <el-form-item label="本次检测数量" prop="CheckNumber">
                                <el-input v-model="model.CheckNumber" placeholder="本次检测数量"  :readonly="true"></el-input>
                            </el-form-item>
                        </el-col>
                        
                        <el-col :span="8">
                             <el-form-item label="不合格数量" prop="Unqualified">
                                <el-input v-model="model.Unqualified" placeholder="不合格数量" :readonly="true"></el-input>
                            </el-form-item>
                        </el-col>
                        
                    </el-row>

                    <el-row>
                        <el-col :span="8">
                            <el-form-item label="开始时间" prop="InspectStartTime">
                                <el-date-picker type="date" placeholder="选择检验开始时间" v-model="model.InspectStartTime" :readonly="true"></el-date-picker>
                            </el-form-item>
                        </el-col>
                        
                        <el-col :span="8">
                            <el-form-item label="结束时间" prop="InspectEndTime">
                                <el-date-picker type="date" placeholder="选择检验结束时间" v-model="model.InspectEndTime" :readonly="true"></el-date-picker>
                            </el-form-item>
                        </el-col>
                        
                        <el-col :span="8">
                            <el-form-item label="状态" prop="Status">
                               <el-select v-model="model.Status" placeholder="请选择状态" disabled="true">
                                    <el-option label="待质检" value="0"></el-option>
                                    <el-option label="检验不通过" value="1"></el-option>
                                    <el-option label="检验通过" value="2"></el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                        
                    </el-row>

            </el-form>

        </el-tab-pane>
        
        <el-tab-pane label="检验标准" name="AddProduct">
                <el-table :data="QcReceiveStandardList" ref="dataForm" v-loading="isLoading" height="400">
                    <el-table-column type="selection" width="55"></el-table-column>
                    <el-table-column  prop="ProjectName" label="检测名称" :show-overflow-tooltip="true"></el-table-column>                    
                    <el-table-column prop="Classify" label="分类" :show-overflow-tooltip="true"></el-table-column>
                    <el-table-column prop="Device" label="检测器具" :show-overflow-tooltip="true"></el-table-column>
                    <el-table-column prop="StandValue" label="标准数值" :show-overflow-tooltip="true"></el-table-column>
                    <el-table-column prop="StandUnit" label="标准单位" :show-overflow-tooltip="true"></el-table-column>
                    <el-table-column prop="Remark" label="描述" :show-overflow-tooltip="true"></el-table-column>


                    <el-table-column label="操作" :show-overflow-tooltip="true">
                        <template slot-scope="scope">
                            <el-button type="text" @click="addQcReceiveRecordItemDetails(scope.row)">缺陷记录</el-button>
                        </template>
                    </el-table-column>
                </el-table>


        </el-tab-pane>
    </el-tabs>
        <!-- 弹窗 -->
        <el-dialog append-to-body :close-on-click-modal="false" :title="dialogDomain.title"
            :visible.sync="dialogDomain.dialogVisible" width="60%"  :show-close="false">
            <QcReceiveRecordItemDetails @callback="QcReceiveRecordItemDetailsCallback" v-if="dialogDomain.dialogVisible && dialogDomain.dialogType == 2"  :CurrQcReceiveStandardModel="CurrQcReceiveStandardModel" :model="this.model"/>
        </el-dialog>

        
 
    </div>
</template>



<script>

import QcReceiveRecordItemDetails from './QcReceiveRecordItemDetails.vue';

export default {
    components: {
        QcReceiveRecordItemDetails,
    },
    props: {
        model: {
            require: true,
            type: Object,

        },
        isUpdate: {
            require: true,
            type: Boolean
        }
    },
    data() {
        return {
            
            activeName: 'Datas',

            //检验标准信息集合
            QcReceiveStandardList:[],
            //检验方式
            InspectWayList:[],
            
            //当前选择的 检验标准
            CurrQcReceiveStandardModel:{},


            isLoading: false,
            
            //对话框对象
            dialogDomain: {
                title: '物料产品选择',
                dialogVisible: false,
                dialogType: 0  //0选择类别  1选择BOM
            },

            rules: {
                RecordCode: { required: true, message: '请输入来料检验单编号', trigger: 'blur' },
                InspectStartTime: { required: true, message: '请选择开始时间', trigger: 'blur' },
                InspectEndTime: { required: true, message: '请选择结束时间', trigger: 'blur' },
                Status: { required: true, message: '请选择来料检验单编号', trigger: 'blur' },
                InspectWay: { required: true, message: '请选择检验方式', trigger: 'blur' },
            }


        }
    },
    //实例生命周期
    created() {
        //获取检验方式
        this.getInspectWayData();
        if(this.isUpdate){
            this.GetQcReceiveRecordItemDetailsByQcReceiveRecordId(this.model.Id);
            
        }
    },
    methods: {
        //重置
        resetForm() {
            this.$refs['ruleForm'].resetFields();
        },
        //获取检验方式数据
        getInspectWayData() {
            this.$http.get('/api/QcWay/GetAll')
                .then(res => {
                    console.log(res);
                    this.InspectWayList=res.Data;
                })
        },


        //缺陷记录
        addQcReceiveRecordItemDetails(model){
            this.CurrQcReceiveStandardModel=model;
            this.dialogDomain.title = "缺陷记录";
            this.dialogDomain.dialogVisible = true;
            this.dialogDomain.dialogType = 2;
        },
        //缺陷记录
        QcReceiveRecordItemDetailsCallback() {
            console.log(this.QcReceiveStandardList);
            this.dialogDomain.dialogVisible = false;
        },
        
        
        //根据商品Id获取来料检验标准
        GetQcReceiveRecordItemDetailsByQcReceiveRecordId(QcReceiveRecordId) {
            this.isLoading=true;
            this.$http.get('/api/QcReceiveRecord/GetQcReceiveRecordItemDetailsByQcReceiveRecordId',{
                params:{
                    QcReceiveRecordId:QcReceiveRecordId
                }
            })
            .then(res => {
                this.QcReceiveStandardList = res.Data;
                
                console.log(this.QcReceiveStandardList);
                this.isLoading=false;
            })
        },

    }
}
</script>
 